import QtQuick 2.12

Rectangle {

    property alias text: textUnder.text
    property string colorEnter: "#bbbbbb"
    property string colorExit: "darkgray"

    property int m_radius: 20
    property string m_imgSource: "qrc:/imgs/pig.png"

    signal sigBtnClicked(var code)


    width: 120
    height: 100
    radius: m_radius
    color: "darkgray"

    Behavior on color { PropertyAnimation { duration: 150 } }

    Image {
        id: img1
        width: 60
        height: 50
        anchors.centerIn: parent
        fillMode: Image.PreserveAspectFit
        smooth: true
        antialiasing: true
        source: m_imgSource
        mirror: true
    }

    Text {
        id: textUnder
        text: ""
        anchors.top: img1.bottom
        anchors.topMargin: 3
        anchors.horizontalCenter: img1.horizontalCenter
    }

    MouseArea {
        anchors.fill: parent
        hoverEnabled: true
        onEntered: {
            parent.color = colorEnter
        }
        onExited: {
            parent.color = colorExit
        }
        onClicked: {
            parent.color = "#eeeeee"
            colorEnter = "#eeeeee"
            colorExit = "#eeeeee"

            emit: sigBtnClicked(text)
        }
    }

    function restoreColor() {
        colorEnter = "#bbbbbb"
        colorExit = "darkgray"
        color = "darkgray"
    }

    function setClicked() {
        color = "#eeeeee"
        colorEnter = "#eeeeee"
        colorExit = "#eeeeee"
    }
}
